<!DOCTYPE html>
<>
<head>
    <title>Stilish CSS3 search box - demo</title>
    <style>
        body {
            font: 13px 'Lucida sans', Arial, Helvetica;
            /*color: #eee;*/
            text-align: center;
        }

        a {
            color: #ccc;
        }

        /*-------------------------------------*/

        .cf:before, .cf:after{
            content:"";
            display:table;
        }

        .cf:after{
            clear:both;
        }

        .cf{
            zoom:1;
        }

        /*-------------------------------------*/

        .form-wrapper {
            width: 450px;
            padding: 15px;
            margin: 50px auto;
            background: #444;
            background: rgba(0,0,0,.2);
            -moz-border-radius: 10px;
            -webkit-border-radius: 10px;
            border-radius: 10px;
            -moz-box-shadow: 0 1px 1px rgba(0,0,0,.4) inset, 0 1px 0 rgba(255,255,255,.2);
            -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.4) inset, 0 1px 0 rgba(255,255,255,.2);
            box-shadow: 0 1px 1px rgba(0,0,0,.4) inset, 0 1px 0 rgba(255,255,255,.2);
        }

        .form-wrapper input {
            width: 330px;
            height: 20px;
            padding: 10px 5px;
            float: left;
            font: bold 15px 'lucida sans', 'trebuchet MS', 'Tahoma';
            border: 0;
            background: #eee;
            -moz-border-radius: 3px 0 0 3px;
            -webkit-border-radius: 3px 0 0 3px;
            border-radius: 3px 0 0 3px;
        }

        .form-wrapper input:focus {
            outline: 0;
            background: #fff;
            -moz-box-shadow: 0 0 2px rgba(0,0,0,.8) inset;
            -webkit-box-shadow: 0 0 2px rgba(0,0,0,.8) inset;
            box-shadow: 0 0 2px rgba(0,0,0,.8) inset;
        }

        .form-wrapper input::-webkit-input-placeholder {
            color: #999;
            font-weight: normal;
            font-style: italic;
        }

        .form-wrapper input:-moz-placeholder {
            color: #999;
            font-weight: normal;
            font-style: italic;
        }

        .form-wrapper input:-ms-input-placeholder {
            color: #999;
            font-weight: normal;
            font-style: italic;
        }

        .form-wrapper button {
            overflow: visible;
            position: relative;
            float: right;
            border: 0;
            padding: 0;
            cursor: pointer;
            height: 40px;
            width: 110px;
            font: bold 15px/40px 'lucida sans', 'trebuchet MS', 'Tahoma';
            color: #fff;
            text-transform: uppercase;
            background: #d83c3c;
            -moz-border-radius: 0 3px 3px 0;
            -webkit-border-radius: 0 3px 3px 0;
            border-radius: 0 3px 3px 0;
            text-shadow: 0 -1px 0 rgba(0, 0 ,0, .3);
        }

        .form-wrapper button:hover{
            background: #e54040;
        }

        .form-wrapper button:active,
        .form-wrapper button:focus{
            background: #c42f2f;
        }

        .form-wrapper button:before {
            content: '';
            position: absolute;
            border-width: 8px 8px 8px 0;
            border-style: solid solid solid none;
            border-color: transparent #d83c3c transparent;
            top: 12px;
            left: -6px;
        }

        .form-wrapper button:hover:before{
            border-right-color: #e54040;
        }

        .form-wrapper button:focus:before{
            border-right-color: #c42f2f;
        }

        .form-wrapper button::-moz-focus-inner {
            border: 0;
            padding: 0;
        }
    </style>
</head>

<body>
<form class="form-wrapper cf" action="/search">
    <input type="text" name="searchVideoName" placeholder="Search here..." required>
    <button type="submit">Search</button>
</form>
<center>
    <table>
        <tr>
            <th>
        <tr id="addOnTail">
            <td id="td1">分类</td><td>名字</td>
        </tr>
        <%docs.forEach(function(doc){
        var fenlei=doc.fenlei;
        var name=doc.name;
        var address=doc.address;
        var id=doc.id;%>
        <tr><td><%=fenlei%></td>
            <td><%=name%></td>
            <td><a href="/videosdelete/<%=doc.id%>"> 删除</a></td>
            <td><a href="/videos_edite/<%=doc.id%>"> 修改</a></td>
            <td><a href="/go_videosplay/<%=doc.id%>"> 播放</a></td>
        </tr>
        <%
        })
        %>
        </th>
        </tr>
    </table>
</center>


</body>
</html>